<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>白菜价</title>

    <!-- 模板文件 -->
    <script src="./lib/artTemplate/template-web.js"></script>

    <script src="./lib/zepto/zepto.min.js"></script>
    <!-- mui文件 -->
    <link rel="stylesheet" href="./lib/mui/css/mui.min.css">
    <script src="./lib/mui/js/mui.min.js"></script>

    <script src="./js/common.js"></script>
    <link rel="stylesheet" href="./css/lowprice.css">
    <script src="./js/lowprice.js"></script>
    <script>
        document.querySelector('html').style.fontSize = window.screen.width / 10 + "px";
    </script>
</head>

<body>
    <div class="contanier">
        <header>
            <a href="./index.html" class="left">
                <span class="mui-icon mui-icon-arrowleft"></span>
            </a>
            <span class="center">白菜价-淘宝内部劵</span>
            <a href="#" class="right">
                <span class="mui-icon mui-icon-download"></span>
                <span>APP下载</span>
            </a>
        </header>

        <nav>
            <div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
                <div class="mui-scroll">
                 
                </div>
            </div>
            <!-- 模板 -->
            <script id="top" type="text/html">
                {{each result}}
                    <a class="mui-control-item" data-id="{{$value.titleId}}">
                        {{$value.title}}
                    </a>
                {{/each}}
            </script>
        </nav>
        <main>
            <div class="mui-scroll-wrapper">
                <div class="mui-scroll">
                    <!-- 商品 -->
                    <div class="products">
                        <ul>
                            <!-- <li>
                                <div class="left"> 
                                    <img src="#" alt="">
                                </div>
                                <div class="right">
                                       <p class="character">[包邮]双十一红包 今日开启</p>
                                       <p><span class="price">劵后¥0.0</span>
                                           <span class="oldprice">¥0</span>
                                       </p>
                                       <div class="num">
                                           <div class="progress">
                                               <div  class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 80%;">
                                                   60%
                                               </div>
                                           </div>
                                           <p>已经82张</p>
                                       </div>
                                       <div class="money">
                                           <p>点此领15元优惠券</p>
                                           <button type="button" class="mui-btn mui-btn-danger">下单链接</button>
                                       </div>
                                </div>  
                            </li>
                                                                    
                        </ul>
                    </div>


                    <!-- 模板 -->
                     <script id="product" type="text/html"> 
                        {{each result}}
                        <li>
                            <div class="left">
                                {{@$value.productImg}}
                            </div>
                            <div class="right">
                                <p class="name">
                                    {{@$value.productName}}
                                </p>
                               
                                <p class=price>
                                    {{@$value.productPrice}}
                                </p>
                                <div class="num">
                                    {{@$value.productCouponRemain}}
                                </div>
                                <div class="money">
                                    {{@$value.productCoupon}}
                                    <button type="button" class="mui-btn mui-btn-danger">下单链接</button>
                                </div>
                            </div>
                        </li>
                        {{/each}}
                    </script> 
                </div>
            </div>

        </main>
        <footer>
           <ul>
               <li>登录</li>
               <li>注册</li>
               <li>返回顶部</li>
           </ul>   
           <div class="up"> 
               <div class="message">
                   <span>手机App下载</span>
                   <span>慢慢买手机版 --</span>
                   <span>掌上比价平台</span>        
               </div>                     
             
               <p>m.manmanbuy.com</p>
           </div>  
        </footer>
    </div>

    <!-- 内动滚动 -->
    <script>
        mui('.mui-scroll-wrapper').scroll({
            deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
        });
    </script>
</body>

</html>